<template>
    <a-drawer :title="title" :width="450" @close="handleCancel" :visible="visible"
              :destroyOnClose="true"
              :maskClosable="false"

              :bodyStyle="{ paddingBottom: '60px' }">

            <!-- 富文本编辑器-->
        <RichEditor :content="content" :height="450" editorHandler="editorHandler"></RichEditor>

        <!-- Modal 页脚 -->
        <footer class="drawer-footer">
            <a-button type="primary" :loading="loading" @click="onSubmit">保存</a-button>
        </footer>
    </a-drawer>
</template>
<script>
    import {hotelArticleFind, hotelArticleSave} from '../public/http.js';


    export default {
        props: ['articleHotelId'],

        components: {
            RichEditor: () => import('../../../common/RichEditor')
        },


        data() {
            return {
                loading: false,
                title: '编辑图文秀',
                visible: false, //modal 显示状态
                content: "",


            };
        },
        methods: {
            editorHandler(val) {
                this.content = val;
            },

            //表单提交事件
            onSubmit() {

                let obj = {
                    hotelId: this.articleHotelId,
                    content: this.content
                }

                hotelArticleSave(obj).then(res => {
                    this.$exMod.ajaxMessage(res);
                    if (res.code === 0) {
                        this.handleCancel();
                    }

                })

            },


            //关闭弹窗
            handleCancel(render = false) {
                this.visible = false;
                this.$emit('closeModal', {render: render});
            },

            async init() {
                await this.getArticle();
                this.visible = true
            },

            getArticle() {

                hotelArticleFind(this.articleHotelId).then(res => {
                    if (res.code === 0 && res.data.result) {
                        this.content = res.data.result.content;
                    }


                })


            },


        },


        created() {

            this.init();


        }
    };
</script>

